import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:getwidget/getwidget.dart';
import 'package:meal/constant/fonts.dart';
import 'package:meal/constant/sizes.dart';
import 'package:meal/ui/draw_under_line.dart';
import 'package:meal/utils/colors.dart';
import 'package:meal/utils/styles.dart';
import 'package:meal/utils/tools.dart';

///
/// 团购订单详情(明细)
///
class GroupOrderDetail extends StatefulWidget {
  const GroupOrderDetail({Key? key}) : super(key: key);

  @override
  State<GroupOrderDetail> createState() => _GroupOrderDetailState();
}

class _GroupOrderDetailState extends State<GroupOrderDetail> with SingleTickerProviderStateMixin {
  late AnimationController _animationController;

  @override
  void initState() {
    super.initState();
    _animationController = BottomSheet.createAnimationController(this);

    ///弹出时长
    _animationController.duration = const Duration(seconds: 1);

    ///收回的时长
    _animationController.reverseDuration = const Duration(milliseconds: 500);
  }

  @override
  void dispose() {
    super.dispose();
    _animationController.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: ToolsUtils.getDefaultBackgroundColor(),
      appBar: ToolsUtils.getDefaultBrnAppBar('订单详情'),
      body: SingleChildScrollView(
        child: Column(
          children: [
            Container(
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
              padding: const EdgeInsets.symmetric(
                  horizontal: Sizes.default10, vertical: Sizes.default10),
              margin: const EdgeInsets.all(Sizes.default20),
              child: Row(
                children: [
                  GFImageOverlay(
                    width: Sizes.default70,
                    height: Sizes.default70,
                    image: const NetworkImage(
                        'https://img1.baidu.com/it/u=3033226715,2238019049&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'),
                    borderRadius: BorderRadius.circular(Sizes.default5),
                  ),
                  Expanded(
                      child: Container(
                    padding: const EdgeInsets.only(left: Sizes.default15),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        Text(
                          '烤肉两人套餐烤肉两人套餐',
                          style: StylesUtils.customTextStyle(
                              fontSize: Sizes.default16, color: ColorsUtils.color333),
                        ),
                        ToolsUtils.iconRightArrow(),
                      ],
                    ),
                  ))
                ],
              ),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
              padding: const EdgeInsets.symmetric(
                  horizontal: Sizes.default10, vertical: Sizes.default10),
              margin: const EdgeInsets.only(
                  top: Sizes.default20, left: Sizes.default20, right: Sizes.default20),
              child: ListBody(
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(bottom: Sizes.default20),
                    child: Text(
                      '使用记录',
                      style: StylesUtils.customTextStyle(
                          color: ColorsUtils.color333,
                          fontSize: Sizes.default15,
                          fontWeight: Fonts.w7),
                    ),
                  ),
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(bottom: Sizes.default10),
                    child: Text(
                      '• 2022-06-05 12:15:19 使用1份',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color797),
                    ),
                  ),
                  Container(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '• 2022-06-05 12:15:19 使用1份',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color797),
                    ),
                  ),
                ],
              ),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
              padding: const EdgeInsets.symmetric(
                  horizontal: Sizes.default10, vertical: Sizes.default10),
              margin: const EdgeInsets.only(
                  top: Sizes.default20, left: Sizes.default20, right: Sizes.default20),
              child: ListBody(
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(bottom: Sizes.default20),
                    child: Text(
                      '退款记录',
                      style: StylesUtils.customTextStyle(
                          color: ColorsUtils.color333,
                          fontSize: Sizes.default15,
                          fontWeight: Fonts.w7),
                    ),
                  ),
                  InkWell(
                    onTap: openModalBottomSheet,
                    child: Container(
                        alignment: Alignment.centerLeft,
                        margin: const EdgeInsets.only(bottom: Sizes.default10),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text.rich(
                              TextSpan(
                                  text: '• ',
                                  style: StylesUtils.customTextStyle(color: ColorsUtils.color797),
                                  children: [
                                    TextSpan(
                                        text: '2022-06-03 11:15:19 申请退款1份',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.colorFf6))
                                  ]),
                            ),
                            ToolsUtils.iconRightArrow()
                          ],
                        )),
                  ),
                  InkWell(
                    onTap: openModalBottomSheet,
                    child: Container(
                        alignment: Alignment.centerLeft,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text.rich(
                              TextSpan(
                                  text: '• ',
                                  style: StylesUtils.customTextStyle(color: ColorsUtils.color797),
                                  children: [
                                    TextSpan(
                                        text: '2022-06-03 11:15:19 申请退款1份',
                                        style: StylesUtils.customTextStyle(
                                            color: ColorsUtils.colorFf6))
                                  ]),
                            ),
                            ToolsUtils.iconRightArrow()
                          ],
                        )),
                  )
                ],
              ),
            ),
            Container(
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(Sizes.default10)),
              padding: const EdgeInsets.symmetric(
                  horizontal: Sizes.default10, vertical: Sizes.default10),
              margin: const EdgeInsets.only(
                  top: Sizes.default20, left: Sizes.default20, right: Sizes.default20),
              child: ListBody(
                children: [
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(bottom: Sizes.default20),
                    child: Text(
                      '过期记录',
                      style: StylesUtils.customTextStyle(
                          color: ColorsUtils.color333,
                          fontSize: Sizes.default15,
                          fontWeight: Fonts.w7),
                    ),
                  ),
                  Container(
                    alignment: Alignment.centerLeft,
                    margin: const EdgeInsets.only(bottom: Sizes.default10),
                    child: Text(
                      '• 2022-06-15 23:59:59 过期12份',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color797),
                    ),
                  ),
                  Container(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      '• 2022-06-15 23:59:59 过期12份',
                      style: StylesUtils.customTextStyle(color: ColorsUtils.color797),
                    ),
                  ),
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }

  void openModalBottomSheet() {
    showModalBottomSheet(
        context: context,
        isScrollControlled: true,
        isDismissible: true,
        enableDrag: true,
        elevation: 0,
        barrierColor: Colors.black.withOpacity(0.5),
        backgroundColor: Colors.white,
        transitionAnimationController: _animationController,
        shape: const RoundedRectangleBorder(
            borderRadius: BorderRadius.only(
                topLeft: Radius.circular(Sizes.default15),
                topRight: Radius.circular(Sizes.default15))),
        builder: (BuildContext context) {
          return SingleChildScrollView(
            child: Column(
              children: [
                DrawUnderLine(
                  dy: Sizes.default10,
                  child: Stack(
                    children: [
                      Container(
                        height: Sizes.default70,
                        alignment: Alignment.center,
                        child: Text(
                          '退款详情',
                          style: StylesUtils.customTextStyle(
                              color: ColorsUtils.color363, fontSize: Sizes.default16),
                        ),
                      ),
                      Positioned(
                          top: 0,
                          right: Sizes.default10,
                          bottom: 0,
                          child: Center(
                              child: IconButton(
                                  onPressed: () {
                                    Navigator.of(context).pop();
                                  },
                                  icon: Icon(
                                    Icons.close,
                                    color:
                                        ColorsUtils.parseColorFromHexString(ColorsUtils.color000),
                                    size: Sizes.default20,
                                  ))))
                    ],
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(
                      horizontal: Sizes.default15, vertical: Sizes.default10),
                  child: ListBody(
                    children: [
                      BrnStepLine(
                        lineWidth: 1,
                        lineColor: ColorsUtils.parseColorFromHexString('#FF644D'),
                        contentWidget: Container(
                          padding: const EdgeInsets.only(left: Sizes.default10),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  Text('退款成功',
                                      style: StylesUtils.customTextStyle(
                                          fontSize: Sizes.default16,
                                          fontWeight: Fonts.w7,
                                          color: ColorsUtils.color333)),
                                  Text(
                                    '09-12 14:24',
                                    style: StylesUtils.customTextStyle(color: ColorsUtils.color999),
                                  )
                                ],
                              ),
                              Padding(
                                padding: const EdgeInsets.only(top: 15, bottom: 30),
                                child: Text(
                                  '订单金额已原路退还成功',
                                  style: StylesUtils.customTextStyle(color: ColorsUtils.color999),
                                ),
                              )
                            ],
                          ),
                        ),
                        iconWidget: ToolsUtils.getUrlSvg(
                            'https://cdn7.axureshop.com/demo/1525603/images/团购退款详情/u3737.svg'),
                        isGrey: false,
                      ),
                      BrnStepLine(
                          lineWidth: 1,
                          lineColor: ColorsUtils.parseColorFromHexString('#FF644D'),
                          isGrey: false,
                          iconWidget: ToolsUtils.getUrlSvg(
                              'https://cdn7.axureshop.com/demo/1525603/images/团购退款详情/u3739.svg'),
                          contentWidget: Container(
                            padding: const EdgeInsets.only(left: Sizes.default10),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    Text('受理时间',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default16,
                                            color: ColorsUtils.color333)),
                                    Text(
                                      '09-12 14:24',
                                      style:
                                          StylesUtils.customTextStyle(color: ColorsUtils.color999),
                                    )
                                  ],
                                ),
                                Padding(
                                  padding: const EdgeInsets.only(top: 15, bottom: 30),
                                  child: Text(
                                    '系统受理本次退款申请',
                                    style: StylesUtils.customTextStyle(color: ColorsUtils.color999),
                                  ),
                                )
                              ],
                            ),
                          )),
                      BrnStepLine(
                          lineWidth: 1,
                          lineColor: ColorsUtils.parseColorFromHexString('#FF644D'),
                          isGrey: false,
                          iconWidget: ToolsUtils.getUrlSvg(
                              'https://cdn7.axureshop.com/demo/1525603/images/团购退款详情/u3739.svg'),
                          contentWidget: Container(
                            padding: const EdgeInsets.only(left: Sizes.default10),
                            child: Column(
                              crossAxisAlignment: CrossAxisAlignment.start,
                              children: [
                                Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    Text('发起申请',
                                        style: StylesUtils.customTextStyle(
                                            fontSize: Sizes.default16,
                                            color: ColorsUtils.color333)),
                                    Text(
                                      '09-12 14:24',
                                      style:
                                          StylesUtils.customTextStyle(color: ColorsUtils.color999),
                                    )
                                  ],
                                ),
                                Padding(
                                  padding: const EdgeInsets.only(top: 15, bottom: 30),
                                  child: Text(
                                    '顾客发起退款申请',
                                    style: StylesUtils.customTextStyle(color: ColorsUtils.color999),
                                  ),
                                )
                              ],
                            ),
                          )),
                    ],
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(horizontal: Sizes.default15),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      GFImageOverlay(
                        width: Sizes.default80,
                        height: Sizes.default80,
                        image: const NetworkImage(
                            'https://img1.baidu.com/it/u=3033226715,2238019049&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'),
                        borderRadius: BorderRadius.circular(Sizes.default5),
                      ),
                      Expanded(
                          child: Container(
                        alignment: Alignment.topLeft,
                        padding: const EdgeInsets.only(left: Sizes.default10),
                        child: Text(
                          '烤肉两人套餐',
                          style: StylesUtils.customTextStyle(color: ColorsUtils.color333),
                        ),
                      ))
                    ],
                  ),
                ),
                Container(
                  padding: const EdgeInsets.symmetric(horizontal: Sizes.default15),
                  child: ListBody(
                    children: [
                      SizedBox(
                        height: Sizes.default40,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '退款单号',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color797, fontSize: Sizes.default15),
                            ),
                            Text(
                              '16797975989287',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color000, fontSize: Sizes.default15),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(
                        height: Sizes.default40,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '申请件数',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color797, fontSize: Sizes.default15),
                            ),
                            Text(
                              '1件',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color000, fontSize: Sizes.default15),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(
                        height: Sizes.default40,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '退款金额',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color797, fontSize: Sizes.default15),
                            ),
                            Text(
                              '￥107.58',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.colorFf0, fontSize: Sizes.default15),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(
                        height: Sizes.default40,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '退款原因',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color797, fontSize: Sizes.default15),
                            ),
                            Text(
                              '菜点错了、菜点多了',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color000, fontSize: Sizes.default15),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(
                        height: Sizes.default40,
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '退款方式',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color797, fontSize: Sizes.default15),
                            ),
                            Text(
                              '原路返回',
                              style: StylesUtils.customTextStyle(
                                  color: ColorsUtils.color000, fontSize: Sizes.default15),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                )
              ],
            ),
          );
        });
  }
}
